
import React, { memo } from 'react'
import type { ReactNode } from 'react'

import { dicoverMenu } from '@/common/local-data'
import { CategoryList, NavBarWrapper } from './style'
import { NavLink } from 'react-router-dom'
interface IProps {
  children?: ReactNode,
}
const AppNavBar: React.FC<IProps> = memo(() => {
  return (
    <NavBarWrapper>
      <CategoryList className="w1100">
        {dicoverMenu.map((item) => {
          return (
            <li key={item.title} className="item">
              <NavLink to={item.link} >
                {item.title}
              </NavLink>
            </li>
          )
        })}
      </CategoryList>
    </NavBarWrapper>
  )
})
export default AppNavBar